<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="{{ url_for('static', filename='/common/css/register.css') }}" rel="stylesheet">
    <title> Register </title>
</head>
<body>
<div class="container">
    <div class="box">
        <div class="content">
            <h1>Dreams Library</h1>
            <form action="/user/register" method="post">
                <div class="form-control" style="position: absolute; top: 110px; left: 30px">
                    <label>
                        <input class="input input-alt" style="width: 75%;" placeholder="Username 字母开头+字母或数字" required="" type="text"
                               name="username">
                    </label>
                    <span class="input-border input-border-alt-username"></span>
                </div>
                <div class="form-control" style="position: absolute; top: 110px; left: 250px">
                    <label>
                        <input class="input input-alt" style="width: 85%" placeholder="Name" required="" type="text"
                               name="name">
                    </label>
                    <span class="input-border input-border-alt-name"></span>
                </div>

                <div class="form-control" style="position: absolute; top: 180px; left: 30px">
                    <label>
                        <input class="input input-alt" style="width: 75%" placeholder="Phone" required="" type="text"
                               name="phone">
                    </label>
                    <span class="input-border input-border-alt-username"></span>
                </div>
                <div class="form-control" style="position: absolute; top: 180px; left: 250px">
                    <label>
                        <input class="input input-alt" style="width: 85%" placeholder="Gender 男/女" required="" type="text"
                               name="gender">
                    </label>
                    <span class="input-border input-border-alt-name"></span>
                </div>

                <div class="form-control" style="position: absolute; top: 250px; left: 30px">
                    <label>
                        <input class="input input-alt" style="width: 140%" placeholder="Mail" required="" type="email"
                               name="mail">
                    </label>
                    <span class="input-border input-border-alt"></span>
                </div>
                <div class="form-control" style="position: absolute; top: 320px; left: 30px">
                    <label>
                        <input class="input input-alt" style="width: 140%" placeholder="Password 大小写字母 8位以上" required="" type="password"
                               name="password">
                    </label>
                    <span class="input-border input-border-alt"></span>
                </div>
                <div class="form-control" style="position: absolute; top: 390px; left: 30px">
                    <label>
                        <input class="input input-alt" style="width: 140%" placeholder="Password Again" required="" type="password"
                               name="repassword">
                    </label>
                    <span class="input-border input-border-alt"></span>
                </div>

                <button type="submit" style="position: absolute; top: 470px; left:20px; width: 400px">
                    <div class="button_2">
                        <div class="svg-wrapper-1">
                            <div class="svg-wrapper">
                                <svg
                                        xmlns="http://www.w3.org/2000/svg"
                                        viewBox="0 0 24 24"
                                        width="24"
                                        height="24"
                                >
                                    <path fill="none" d="M0 0h24v24H0z"></path>
                                    <path
                                            fill="currentColor"
                                            d="M1.946 9.315c-.522-.174-.527-.455.01-.634l19.087-6.362c.529-.176.832.12.684.638l-5.454 19.086c-.15.529-.455.547-.679.045L12 14l6-8-8 6-8.054-2.685z"
                                    ></path>
                                </svg>
                            </div>
                        </div>
                        <span>发送邮箱验证码</span>
                    </div>
                </button>
            </form>
        </div>

    </div>
</div>
</body>
</html>